<template>
  <div class="wisdomBindTask">
    <c-title :hide="false" :text="`${fun.initWithdrawal()}到银行卡-智E+`"> </c-title>
    <div class="txt">请完成以下内容</div>
    <div class="list" :class="infoData.is_bind_mobile ? 'listSuccess' : ''" @click="tobind('phone')">
      <div class="line">
        <div class="left">绑定手机号</div>
        <div class="right">
          <div class="none" v-if="!infoData.is_bind_mobile">未绑定</div>
          <div class="none" v-else>已绑定</div>
          <van-icon name="arrow" color="#a5a5a5" v-if="!infoData.is_bind_mobile" />
        </div>
      </div>
    </div>
    <div class="list" :class="infoData.is_auth ? 'listSuccess' : ''" @click="tobind('auth')">
      <div class="line">
        <div class="left">实名认证</div>
        <div class="right">
          <div class="none" v-if="!infoData.is_auth">未认证</div>
          <div class="none" v-else>已认证</div>
          <van-icon name="arrow" color="#a5a5a5" v-if="!infoData.is_auth" />
        </div>
      </div>
    </div>
    <div class="list" @click="toUrl" :class="infoData.is_agreement ? 'listSuccess' : ''">
      <div class="line">
        <div class="left">签约</div>
        <div class="right">
          <div class="none" v-if="!infoData.is_agreement">未签约</div>
          <div class="none" v-else>已签约</div>
          <van-icon name="arrow" color="#a5a5a5" v-if="!infoData.is_agreement" />
        </div>
      </div>
    </div>
    <div class="list" @click="toBindCard">
      <div class="line">
        <div class="left">绑卡</div>
        <div class="right">
          <div class="none"></div>
          <van-icon name="arrow" color="#a5a5a5" />
        </div>
      </div>
    </div>

    <div class="btn set-pc-style">
      <div class="leftbtn" :class="status ? 'sBtn' : ''" @click="tapWithdrawal('balance')">去{{ BalanceName }}{{ fun.initWithdrawal() }}</div>
      <div class="leftbtn" :class="status ? 'sBtn' : ''" @click="tapWithdrawal('income')">去{{ income_name_text }}{{ fun.initWithdrawal() }}</div>
    </div>
  </div>
</template>
<script>
import withdraw from "./components/withdraw.vue";
export default {
  data() {
    return {
      infoData: [],
      agreementUrl: "",
      status: false,
      income_name_text: "",
      BalanceName: ""
    };
  },
  activated() {
    this.checkAgreement();
    this.getData();
    try {
      //第一次进入首页并带参数basic_info，并符合新人奖条件
      let yz_basic_info = JSON.parse(localStorage.getItem("yz_basic_info"));
      this.income_name_text = yz_basic_info.lang.income.income_name;
      this.BalanceName = this.fun.getBalanceLang();
    } catch (err) {
      console.log(err);
    }
  },
  methods: {
    tapWithdrawal(key) {
      if (!this.status) {
        return;
      }
      if (key == "balance") {
        this.$router.push(this.fun.getUrl("balance_withdrawals", {}));
      } else {
        this.$router.push(this.fun.getUrl("withdrawal", {}));
      }
    },
    toBindCard() {
      // 去绑定银行卡
      this.$router.push(this.fun.getUrl("addWisdomBank", { to: "wisdomBindTask" }));
    },
    tobind(key) {
      if (key == "phone") {
        if (this.infoData.is_bind_mobile == "1") return;
        this.$router.push(this.fun.getUrl("wisdomBind", { option: "phone" }));
      } else {
        if (this.infoData.is_auth == "1") return;
        this.$router.push(this.fun.getUrl("wisdomBind", { option: "auth" }));
      }
    },
    getData() {
      $http
        .get("plugin.eplus-pay.frontend.index.index", {}, "")
        .then(
          response => {
            if (response.result === 1) {
              this.infoData = response.data;
              if (this.infoData.is_auth == "1" && this.infoData.is_agreement == "1" && this.infoData.is_bind_mobile == "1") {
                this.status = true;
              } else {
                this.status = false;
              }
              if (this.infoData.is_agreement == 0) {
                this.getAgreementUrl();
              }
            } else {
              this.$dialog.alert({
                message: response.msg
              });
            }
          },
          response => {
            this.$dialog.alert({
              message: response
            });
          }
        )
        .catch(err => {
          console.error(err);
      });
    },
    toUrl() {
      if (this.infoData.is_agreement == 0) {
        window.location.href = this.agreementUrl;
      }
    },
    checkAgreement() {
      $http
        .get("plugin.eplus-pay.frontend.agreement.confirmAgreement", {}, "")
        .then(
          response => {
            if (response.result === 1) {
              console.log(response.data);
              this.infoData.is_agreement = 1;
            }
          },
          response => {
            this.$dialog.alert({
              message: response
            });
          }
        )
        .catch(err => {
          console.error(err);
        });
    },
    getAgreementUrl() {
      $http
        .get("plugin.eplus-pay.frontend.agreement.agreementUrl", {}, "")
        .then(
          response => {
            if (response.result === 1) {
              this.agreementUrl = response.data.url;
            } else {
              this.$dialog.alert({
                message: response.msg
              });
            }
          },
          response => {
            this.$dialog.alert({
              message: response
            });
          }
        )
        .catch(err => {
          console.error(err);
        });
    }
  },
  components: {
    withdraw
  }
};
</script>
<style lang="scss" scoped>
.wisdomBindTask {
  padding: 0.625rem;

  .txt {
    text-align: left;
    margin-bottom: 0.625rem;
  }

  .listSuccess {
    .none {
      color: #ff8282 !important;
    }
  }

  .list {
    padding: 0 0.625rem;
    border-radius: 0.325rem;
    background: #fff;

    .line {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0.5rem 0;
      margin-bottom: 0.625rem;

      .right {
        display: flex;
        align-items: center;

        .none {
          color: #a5a5a5;
        }
      }
    }
  }
}

.btn {
  height: 2.5rem;
  font-size: 1rem;
  font-weight: 400;
  color: #fff;
  border-radius: 0.3125rem;
  display: flex;
  align-items: center;
  justify-content: space-around;
  position: fixed;
  bottom: 1rem;
  width: 90%;
  left: 5%;

  .leftbtn:first-child {
    margin-right: 0.625rem;
  }

  .leftbtn {
    flex: 1;
    background: #bababa;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.3125rem;
  }

  .sBtn {
    background: #ff5c5c;
  }
}
</style>